<!DOCTYPE html>
<html lang="en">
<head>
    <title>客户套餐查询</title>
    <#include "/include/header.ftl">
    <link rel="stylesheet" href="/static/css/ContentSytle.css">


    <!--树形菜单引用-->
    <link rel="stylesheet" type="text/css"  href="/static/js/X-admin/lib/ztree-select-search/css/bootstrapStyle/bootstrapStyle.css" />
    <link rel="stylesheet" type="text/css" href="/static/js/X-admin/lib/ztree-select-search/css/zTreeSelect.css" />
    <script type="text/javascript" src="/static/js/X-admin/lib/ztree-select-search/js/jquery.ztree.core.js"></script>
    <script type="text/javascript" src="/static/js/X-admin/lib/ztree-select-search/js/jquery.ztree.excheck.js"></script>
    <script type="text/javascript" src="/static/js/X-admin/lib/ztree-select-search/js/jquery.ztree.exedit.js"></script>
    <script type="text/javascript" src="/static/js/X-admin/lib/ztree-select-search/js/jquery.ztree.exhide.min.js"></script>
    <script type="text/javascript" src="/static/js/X-admin/lib/ztree-select-search/js/zTreeSelect.js"></script>
    <script type="text/javascript" src="/static/js/X-admin/lib/ztree-select-search/TreeSelect.js"></script>


</head>
<body class="tablebody">
<div class="Container">
    <!--表格内容-->
    <div class="TableCont">
        <div class="TableColme">
            <form class="layui-form" action="">
                <!--搜索-->
                <div class="tableSearch">
                    <input type="search" id="TableSearch" class="layui-input" placeholder="卡号，ICCID，套餐名称"/>
                    <button type="button" id="SearchBtn">搜索</button>
                </div>
                <!--搜索 end-->
                <!--筛选-->
                <div class="tableFilter" id="tableFilter">
                    <a href="javascript:;" class="tit">筛选器</a>
                    <div class="FilterCont" id="FilterCont">
                        <ul>

                            <li>
                                <div class="title">渠道</div>
                                <div class="inputCont" id="zTreeSelect">
                                    <div class="zTreeSelect" style="width:100%;" zTreeSelect-search-field="name">
                                        <input type="hidden" id="qudaoInput" class="zTreeSelect-hidden" value="" autocomplete="off"/>
                                        <input type="text" class="zTreeSelect-text" id="qudaoSelect" zTreeSelect-text-field="name" autocomplete="off" placeholder="全部">
                                        <span class="zTreeSelect-arrow arrow-down">&nbsp;</span>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="title">运营商</div>
                                <div class="inputCont select">
                                    <select>
                                        <option value="">全部</option>
                                        <option value="移动">移动</option>
                                        <option value="联通">联通</option>
                                        <option value="电信">电信</option>
                                    </select>
                                </div>
                            </li>

                            <li>
                                <div class="title">状态</div>
                                <div class="inputCont select">
                                    <select>
                                        <option value="全部">全部</option>
                                        <option value="测试期">测试期</option>
                                        <option value="沉默期">沉默期</option>
                                        <option value="未激活">未激活</option>
                                        <option value="已激活">已激活</option>
                                        <option value="停机">停机</option>
                                        <option value="报警">报警</option>
                                        <option value="已失效">已失效</option>
                                        <option value="已销户">已销户</option>
                                    </select>
                                </div>
                            </li>

                            <li>
                                <div class="title">剩余用量比例</div>
                                <div class="inputCont">
                                    <input type="text" class="layui-input input-min"   placeholder="0">
                                    <span class="row">-</span>
                                    <input type="text" class="layui-input input-min"   placeholder="100">
                                </div>
                            </li>

                            <li>
                                <div class="title">起止号码</div>
                                <div class="inputCont">
                                    <input type="text" class="layui-input input-min"   placeholder="开始">
                                    <span class="row">-</span>
                                    <input type="text" class="layui-input input-min"   placeholder="结束">
                                </div>
                            </li>

                            <li>
                                <div class="title">激活时间</div>
                                <div class="inputCont"><input type="text" class="layui-input Time" id="Time-jh" placeholder="请选择时间段" autocomplete="off"></div>
                            </li>
                            <li>
                                <div class="title">订单号</div>
                                <div class="inputCont"><input type="text" class="layui-input " placeholder="请输入订单号" ></div>
                            </li>


                        </ul>
                        <div class="FilterBtnCont">
                            <button type="reset" class="btn-min btnNone" id="FilterClearBtn">清除</button>
                            <button type="reset" class="btn-min" id="FilterCancelBtn">取消</button>
                            <button type="button" class="btn-min btn-Orange" id="FilterBtn">筛选</button>
                        </div>

                    </div>
                </div>
                <!--筛选 end-->
            </form>
            <!--操作-->
            <div class="tableOperating" id="tableOperating">
                <h3>操作</h3>
                <div class="OperatingList" id="OperatingList">
                    <ul>
                        <li class="select">
                            <h3><a href="javascript:;">划卡</a></h3>
                            <dl>
                                <dd><a href="javascript:;" id="huaka">划卡</a></dd>
                                <dd><a href="javascript:;" id="pilianghuaka">批量划卡</a></dd>
                                <dd><a href="javascript:;" id="daoruhuaka">导入划卡</a></dd>
                            </dl>
                        </li>
                        <li class="select">
                            <h3><a href="javascript:;">生命周期变更</a></h3>
                            <dl>
                                <dd><a href="javascript:;" id="daizhuanjihuo"><i class="icon1"></i>转待激活</a></dd>
                                <dd><a href="javascript:;" id="qiangzhijihuo"><i class="icon2"></i>强制激活</a></dd>
                                <dd><a href="javascript:;" id="tingji"><i class="icon3"></i>停机</a></dd>
                                <dd><a href="javascript:;" id="fuji"><i class="icon4"></i>复机</a></dd>
                            </dl>
                        </li>
                        <li class="select">
                            <h3><a href="javascript:;">数据服务</a></h3>
                            <dl>
                                <dd><a href="javascript:;" id="guanbi"><i class="icon5"></i>关闭</a></dd>
                                <dd><a href="javascript:;" id="huifu"><i class="icon4"></i>恢复</a></dd>
                            </dl>
                        </li>
                        <li>
                            <h3><a href="javascript:;" id="daochu">导出</a></h3>
                        </li>
                    </ul>
                </div>
            </div>
            <!--操作 end-->

            <!--表格字段显示选择-->
            <div class="TableRow">
                <a href="javascript:;">显示字段</a>

            </div>
            <!--表格字段显示选择 end-->


            <!--表格独立分页 -->
            <div class="tablePage" id="TablePage"></div>
            <!--表格独立分页-->


        </div>
        <!--表格数据-->
        <table class="layui-table layui-hide"  lay-even="" lay-skin="row" id="TableData" lay-filter="TableData"></table>
        <!--表格数据 end-->

    </div>
    <!--表格内容 end-->
</div>
<#include "/include/footer.ftl">

<!--表格操作-->
<script type="text/html" id="barCaozuo">
    <div class="OperatingRow">
        <a class="title" href="javascript:;">操作</a>
        <ul>
            <li><a lay-event="chongzhi">充值</a></li>
            <li><a lay-event="jiebang">公众号解绑</a></li>
            <li><a lay-event="smzqbgjl">生命周期变更记录</a></li>
        </ul>
    </div>
</script>
<!--表格操作 end-->


<script type="text/javascript">
    layui.use(['laydate','table','laypage','form'], function(){
        var table = layui.table;laydate = layui.laydate;form = layui.form;laypage = layui.laypage;
        var heightTable= $('.page-content', window.parent.document).outerHeight(true)-145;
        //表格数据
        table.render({
            elem: '#TableData'
            ,height: heightTable
            ,limit:30
            , even:true
            ,toolbar: 'filter'
            ,defaultToolbar: ['filter']
            ,page:{
                limit:30//每页显示条数
                ,layout: ['count','prev','skip','next', 'refresh']
                ,prev: '<em>◀</em>'
                ,next: '<em>▶</em>'
            }
            ,cols: [[
                //表头
                {type:'checkbox',width:40}
                ,{field:'caozuo',title:'操作',width:50,toolbar: '#barCaozuo',align:'center'}
                ,{field:'kahao',title:'卡号',width:200}
                ,{field:'ICCID',title:'ICCID',width:200}
                ,{field:'dingdanhao',title:'订单号',width:200}
                ,{field:'zhuangtai',title:'状态',width:100}
                ,{field:'qudao',title:'渠道',width:100}
                ,{field:'yunyingshang',title:'运营商',width:100}
                ,{field:'jihuoshijian',title:'激活时间',width:140}
                ,{field:'taocanmingcheng',title:'套餐名称',width:100}
                ,{field:'fuwudaoqishijian',title:'服务到期时间',width:140}
                ,{field:'kaishishijian',title:'开始时间',width:140}
                ,{field:'jieshushijian',title:'结束时间',width:140}
                ,{field:'zongliang',title:'套餐总用量',width:100}
                ,{field:'shengyuliang',title:'套餐剩余量',width:100}
                ,{field:'yiyongliang',title:'套餐已用量',width:100}

            ]]
            ,data:[
                //表格数据
                {
                    "kahao":'861064684295101',
                    "ICCID":'89860617080036919254',
                    "zhuangtai":'已激活',
                    "dingdanhao":'465415646464',
                    "yunyingshang":'联通',
                    "jihuoshijan":'2018-01-24 16:25:16',
                    "taocanmingcheng":'套餐名称',
                    "fuwudaoqishijian":'2018-01-24 16:25:16',
                    "kaishishijian":'2018-01-24 16:25:16',
                    "jieshushijian":'2018-01-24 16:25:16',
                    "zongliang":'0',
                    "yiyong":'10',
                    "shengyu":'70'
                },
                {
                    "kahao":'861064684295101',
                    "ICCID":'89860617080036919254',
                    "dingdanhao":'465415646464',
                    "zhuangtai":'已激活',
                    "yunyingshang":'联通',
                    "jihuoshijan":'2018-01-24 16:25:16',
                    "taocanmingcheng":'套餐名称',
                    "fuwudaoqishijian":'2018-01-24 16:25:16',
                    "kaishishijian":'2018-01-24 16:25:16',
                    "jieshushijian":'2018-01-24 16:25:16',
                    "zongliang":'0',
                    "yiyong":'10',
                    "shengyu":'70'
                },
                {
                    "kahao":'861064684295101',
                    "ICCID":'89860617080036919254',
                    "dingdanhao":'465415646464',
                    "zhuangtai":'已激活',
                    "yunyingshang":'联通',
                    "jihuoshijan":'2018-01-24 16:25:16',
                    "taocanmingcheng":'套餐名称',
                    "fuwudaoqishijian":'2018-01-24 16:25:16',
                    "kaishishijian":'2018-01-24 16:25:16',
                    "jieshushijian":'2018-01-24 16:25:16',
                    "zongliang":'0',
                    "yiyong":'10',
                    "shengyu":'70'
                },
                {
                    "kahao":'861064684295101',
                    "ICCID":'89860617080036919254',
                    "dingdanhao":'465415646464',
                    "zhuangtai":'已激活',
                    "yunyingshang":'联通',
                    "jihuoshijan":'2018-01-24 16:25:16',
                    "taocanmingcheng":'套餐名称',
                    "fuwudaoqishijian":'2018-01-24 16:25:16',
                    "kaishishijian":'2018-01-24 16:25:16',
                    "jieshushijian":'2018-01-24 16:25:16',
                    "zongliang":'0',
                    "yiyong":'10',
                    "shengyu":'70'
                }
            ]
        });



        //筛选器检索
        $('#FilterBtn').click(function () {
            $('.tableFilter').removeClass('open');
            layer.msg('暂无数据！');
        });

        //搜索框点搜索
        $('#SearchBtn').click(function () {
            layer.msg('暂无数据！')
        });

        //搜索框回车搜索
        $("#TableSearch").keypress(function (e) {
            layer.msg('暂无数据！')
        });

        //初始化渠道菜单
        var setting = {
            view : {dblClickExpand : false, selectedMulti : false, showIcon : true, filter:true, fontCss : getFontCss},
            check: {chkStyle : "checkbox", enable : false},
            data : {simpleData : {enable : true}},
            callback : {onClick : zTreeOnClick, onCheck : zTreeOnClick}
        };
        $(function () {$("#qudaoSelect").zTreeSelect(setting, zNodes);});

        laydate.render({elem: '#Time-jh',format: 'yyyy.MM.dd',range: '-'});//激活时间

        //选择表格字段
        form.on('checkbox(allChecked)', function (data) {
            if (this.checked){
                $("input[name='tableSel']:checkbox").each(function(){
                    $(this).prop("checked", 'checked');
                });
            } else {
                $("input[name='tableSel']:checkbox").each(function() {
                    $(this).prop("checked", false);
                });
            }
            form.render('checkbox');
        });


        table.on('tool(TableData)', function(obj){
            var data = obj.data;
            if(obj.event === 'chongzhi'){
                //充值操作
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:'500px',
                    btnAlign: 'r',
                    skin:'layerOpen',
                    shade:0.2,
                    title: '充值',//弹窗标题
                    content: '<form class="layui-form" action=""><div class="layerOpenCont">' +
                        '<div class="layerForm">' +
                        '<ul>' +
                        '<li>' +
                        '<div class="title">套餐</div>' +
                        '<div class="inputCont select">' +
                        '<select lay-verify="taocan">' +
                        '<option value="">请选择套餐</option>' +
                        '<option value="1">套餐1</option>' +
                        '<option value="2">套餐2</option>' +
                        '<option value="3">套餐3</option>' +
                        '<option value="4">套餐4</option>' +
                        '</select>' +
                        '</div>' +
                        '</li>' +
                        '<li><div class="title">充值金额</div><div class="inputCont"><input class="layui-input" lay-verify="jiner" placeholder="请输入金额"/></div></li>' +
                        '</ul>' +
                        '<p><i>●</i>确保账户有足够金额扣减；</p>' +
                        '<p><i>●</i>充值扣减金额为套餐标准价格*销售折扣；</p>' +
                        '<p><i>●</i>自定义卡充值的为自定义套餐包；</p>' +
                        '</div>' +
                        '</div>' +
                        '<div class="layui-layer-btn layui-layer-btn-r">' +
                        '<button class="btn-min layui-layer-btn0" type="button" onclick="top.closeBtn()">取消</button>' +
                        '<button class="btn-min layui-layer-btn1" lay-submit="" lay-filter="submitBtn">确定</button>' +
                        '</div>' +
                        '</form>',
                    success: function(layero, index){
                        top.form.render();
                        //验证表单
                        top.form.verify({
                            jiner: function(value){
                                if(value==''){
                                    return '请输入金额';
                                }


                            },
                            taocan:function (value) {
                                if(value==''){
                                    return '请选择套餐';
                                }
                            }

                        });
                        //提交表单
                        top.form.on('submit(submitBtn)', function (data) {
                            top.success('充值成功');//成功提示
                            return false;
                        });
                    }
                });
            }
            if(obj.event === 'jiebang'){
                //公众号解绑
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:'450px',
                    btnAlign: 'r',
                    skin:'layerTips',
                    shade:0.2,
                    title:false,
                    closeBtn:0,
                    content: "" +
                        "<div class='layerOpenCont'>" +
                        "<div class='Layer-txt'>" +
                        "<h3>您确定要解绑吗？</h3>" +
                        "<p>解绑之后可重新绑定</p>" +
                        "</div>" +
                        "</div>",
                    btn:['取消','确定'],
                    btn2:function () {
                        //确认回调代码
                        top.success('解绑成功');//成功提示
                        return false
                    }
                })
            }


            if(obj.event==='smzqbgjl'){
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:['760px','500px'],
                    btnAlign: 'r',
                    skin:'layerOpen',
                    shade:0.2,
                    title: '声明周期变更记录',//弹窗标题
                    content: '<div class="layerTable" >' +
                        '<div class="layerOpenCont layerTableCont2" style="padding:0">' +
                        '<div class="layui-tab wlwk-bgzq">' +
                        '<ul class="layui-tab-title"><li class="layui-this">时间轴</li><li>报表</li></ul>' +
                        '<div class="layui-tab-content">' +

                        '<div class="layui-tab-item layui-show">' +
                        '<div class="czList">' +
                        '<h3>2019年5月</h3>' +
                        '<ul>' +
                        '<li><div class="time">5月25日</div><div class="czCont"><div class="line-icon"><hr sty/><i class="icon-1"></i></div><div class="cont"><p class="txt">停机</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">5月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-2"></i></div><div class="cont"><p class="txt">复机</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">5月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-3"></i></div><div class="cont"><p class="txt">激活</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">5月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-4"></i></div><div class="cont"><p class="txt">库存</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">5月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-5"></i></div><div class="cont"><p class="txt">销户</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '</ul>' +

                        '<h3>2019年4月</h3>' +
                        '<ul>' +
                        '<li><div class="time">4月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-1"></i></div><div class="cont"><p class="txt">停机</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">4月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-2"></i></div><div class="cont"><p class="txt">复机</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">4月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-3"></i></div><div class="cont"><p class="txt">激活</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">4月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-4"></i></div><div class="cont"><p class="txt">库存</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">4月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-5"></i></div><div class="cont"><p class="txt">销户</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '</ul>' +

                        '<h3>2019年3月</h3>' +
                        '<ul>' +
                        '<li><div class="time">3月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-1"></i></div><div class="cont"><p class="txt">停机</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">3月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-2"></i></div><div class="cont"><p class="txt">复机</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">3月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-3"></i></div><div class="cont"><p class="txt">激活</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">3月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-4"></i></div><div class="cont"><p class="txt">库存</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '<li><div class="time">3月25日</div><div class="czCont"><div class="line-icon"><hr/><i class="icon-5"></i></div><div class="cont"><p class="txt">销户</p><p>2019-04-14 15:20:45</p></div></div></li>' +
                        '</ul>' +
                        '</div>' +
                        '</div>' +

                        '<div class="layui-tab-item">' +
                        '<div class="TableCont" style="position:relative;">' +
                        '<table class="layui-table layui-hide"  lay-even="" lay-skin="row" id="TableInfo" lay-filter="TableInfo"></table>' +
                        '</div>' +
                        '</div>' +

                        '</div>' +
                        '</div>' +
                        '</div></div> ',
                    success: function(layero, index){
                        top.form.render();//弹窗后初始化表单样式

                        var tableIns = top.table.render({
                            elem: '#TableInfo'
                            , limit: 30
                            , even: true
                            ,width:719
                            ,height:365
                            ,page:{
                                limit:30//每页显示条数
                                ,layout: ['count','prev','skip','next', 'refresh']
                                ,prev: '<em>◀</em>'
                                ,next: '<em>▶</em>'
                                ,theme:'Pageright'
                            },
                            cols: [[
                                //表头
                                {field: 'zhuangtai', title: '状态', width:380}
                                , {field: 'shijian', title: '操作时间', width:336}
                            ]]
                            , data: [
                                {
                                    "zhuangtai": '销户',
                                    "shijian": '2019-04-01 18:37:25'
                                },
                                {
                                    "zhuangtai": '停机',
                                    "shijian": '2019-04-01 18:37:25'
                                },
                                {
                                    "zhuangtai": '复机',
                                    "shijian": '2019-04-01 18:37:25'
                                },
                                {
                                    "zhuangtai": '激活',
                                    "shijian": '2019-04-01 18:37:25'
                                }

                            ]
                        });
                        top.table.reload('TableInfo', tableIns);


                        /* top.$(".czList  ul").each(function() {
                         var num=top.$(this).find("li").length;
                         if(num == 1){
                         top.$(this).find("li").addClass('aa')
                         }
                         });
                         */

                    }
                })
            }
        });

        //划卡
        $('#huaka').click(function () {
            var checkStatus = table.checkStatus('TableData'), data = checkStatus.data;
            if(data == 0){
                layer.msg('请先选择数据，在进行操作！')
            }else {
                //划卡弹窗
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:'500px',
                    btnAlign: 'r',
                    skin:'layerOpen',
                    shade:0.2,
                    title: '划卡',//弹窗标题
                    content: '' +
                        '<form class="layui-form" action="">' +
                        '<div class="layerOpenCont"><div class="layerForm">' +
                        '<ul>' +
                        '<li>' +
                        '<div class="title">渠道</div>' +
                        '<div class="inputCont">' +
                        '<div class="zTreeSelect" style="width:100%;" zTreeSelect-search-field="name">' +
                        '<input type="hidden" id="qudaoInputLayer" class="zTreeSelect-hidden" value="" autocomplete="off"/>' +
                        '<input type="text" class="layui-input zTreeSelect-text" id="qudaoSelectLayer" zTreeSelect-text-field="name" autocomplete="off" placeholder="请选择" lay-verify="qudao">' +
                        '<span class="zTreeSelect-arrow arrow-down">&nbsp;</span>' +
                        '</div>' +
                        '</div>' +
                        '</li>' +
                        '</ul>' +
                        '<p><i>●</i>支持跨级划拨</p>' +
                        '</div>' +
                        '</div>' +
                        '<div class="layui-layer-btn layui-layer-btn-r">' +
                        '<button class="btn-min layui-layer-btn0" type="button" onclick="top.closeBtn()"  id="closeBtn">取消</button>' +
                        '<button class="btn-min layui-layer-btn1" lay-submit="" id="submitBtn"  lay-filter="submitBtn">确定</button>' +
                        '</div>' +
                        '</form>',
                    success: function(layero, index){
                        //弹窗初始化菜单
                        var setting = {
                            view : {dblClickExpand : false, selectedMulti : false, showIcon : true, filter:true, fontCss : getFontCss},
                            check: {chkStyle : "checkbox", enable : false},
                            data : {simpleData : {enable : true}},
                            callback : {
                                onClick : top.zTreeOnClick,
                                onCheck : top.zTreeOnClick
                            }
                        };
                        $(function () {top.$("#qudaoSelectLayer").zTreeSelect(setting, zNodes);});//初始化渠道菜单

                        //验证表单{icon:1,shift:6}
                        top.form.verify({
                            qudao: function(value){
                                if(value==''){
                                    return '请选择渠道';
                                }
                            }

                        });
                        //提交表单
                        top.form.on('submit(submitBtn)', function (data) {
                            top.success('操作成功');//成功提示
                            //top.failure('导入失败','网络异常，请检查网络，稍后重试');//错误提示
                            return false;
                        });
                    }
                })
            }

        });

        //批量划卡
        $('#pilianghuaka').click(function () {
            top.layer.open({
                type:1,
                fix: false, //不固定
                maxmin: true,
                move:false,
                area:'500px',
                btnAlign: 'r',
                skin:'layerOpen',
                shade:0.2,
                title: '批量划卡',//弹窗标题
                content: '' +
                    '<form class="layui-form" action=""><div class="layerOpenCont"><div class="layerForm">' +
                    '<ul>' +
                    '<li>' +
                    '<div class="title">选择类型</div>' +
                    '<div class="inputCont">' +
                    '<span class="rowCont"><input type="radio" name="echartsSwitch" value="1" title="卡号" checked></span>' +
                    '<span class="rowCont"><input type="radio" name="echartsSwitch" value="2" title="ICCID"></span>' +
                    '</div>' +
                    '</li>' +
                    '<li><div class="title">起止号码</div>' +
                    '<div class="inputCont">' +
                    '<div class="inputRow"><input type="text" class="layui-input" placeholder="开始" autocomplete="off" lay-verify="qishi"></div>' +
                    '<em>-</em>' +
                    '<div class="inputRow"><input type="text" class="layui-input" placeholder="结束" autocomplete="off" lay-verify="jieshu"></div>' +
                    '</div>' +
                    '</li>' +
                    '<li>' +
                    '<div class="title">渠道</div>' +
                    '<div class="inputCont">' +
                    '<div class="zTreeSelect" style="width:100%;" zTreeSelect-search-field="name">' +
                    '<input type="hidden" id="qudaoInputLayer" class="zTreeSelect-hidden" value="" autocomplete="off"/>' +
                    '<input type="text" class="zTreeSelect-text" id="qudaoSelectLayer" zTreeSelect-text-field="name" autocomplete="off" placeholder="请选择" lay-verify="qudao">' +
                    '<span class="zTreeSelect-arrow arrow-down">&nbsp;</span>' +
                    '</div>' +
                    '</div>' +
                    '</li>' +
                    '</ul>' +
                    '<p><i>●</i>起止卡号或ICCID必须为连续号码</p>' +
                    '</div>' +
                    '</div>' +
                    '<div class="layui-layer-btn layui-layer-btn-r">' +
                    '<button class="btn-min layui-layer-btn0" type="button" onclick="top.closeBtn()">取消</button>' +
                    '<button class="btn-min layui-layer-btn1" lay-submit="" id="submitBtn"  lay-filter="submitBtn">确定</button>' +
                    '</div>' +
                    '</form>',
                success: function(layero, index){
                    top.form.render();//弹窗后初始化表单样式
                    //弹窗初始化菜单
                    var setting = {
                        view : {dblClickExpand : false, selectedMulti : false, showIcon : true, filter:true, fontCss : getFontCss},
                        check: {chkStyle : "checkbox", enable : false},
                        data : {simpleData : {enable : true}},
                        callback : {
                            onClick : top.zTreeOnClick,
                            onCheck : top.zTreeOnClick
                        }
                    };
                    $(function () {top.$("#qudaoSelectLayer").zTreeSelect(setting, zNodes);});//初始化渠道菜单


                    //验证表单
                    top.form.verify({
                        qishi: function(value){
                            if(value==''){
                                return '请输入开始号码';
                            }

                        },
                        jieshu:function (value) {
                            if(value==''){
                                return '请输入结束号码';
                            }
                        },
                        qudao:function (value) {
                            if(value==''){
                                return '请选择渠道';
                            }
                        }

                    });
                    //提交表单
                    top.form.on('submit(submitBtn)', function (data) {
                        top.success('操作成功');//成功提示
                        //top.failure('导入失败','网络异常，请检查网络，稍后重试');//错误提示
                        return false;
                    });
                }
            })
        });

        //导入划卡
        $('#daoruhuaka').click(function () {
            top.layer.open({
                type:1,
                fix: false, //不固定
                maxmin: true,
                move:false,
                area:'500px',
                btnAlign: 'r',
                skin:'layerOpen',
                shade:0.2,
                title: '导入划卡',//弹窗标题
                content: '' +
                    '<form class="layui-form" action=""><div class="layerOpenCont"><div class="layerForm">' +
                    '<ul>' +
                    '<li>' +
                    '<div class="title">选择文件</div>' +
                    '<div class="inputCont">' +
                    '<div class="input-file">' +
                    '<input type="text" class="fileinput"  name="file" placeholder="点击选择文件"  onfocus="this.blur()" lay-verify="daoru"/>' +
                    '<input type="file" class="fileSel" style="display: none" lay-verify="daoru"></div> ' +
                    '</div>' +
                    '<div class="contOther"><a href="/static/images/checkbox-disbaled.png" target="_blank">下载模板</a></div> ' +
                    '</li>' +
                    '<li>' +
                    '<div class="title">渠道</div>' +
                    '<div class="inputCont">' +
                    '<div class="zTreeSelect" style="width:100%;" zTreeSelect-search-field="name">' +
                    '<input type="hidden" id="qudaoInputLayer" class="zTreeSelect-hidden" value="" autocomplete="off"/>' +
                    '<input type="text" class="zTreeSelect-text" id="qudaoSelectLayer" zTreeSelect-text-field="name" autocomplete="off" placeholder="请选择" lay-verify="qudao">' +
                    '<span class="zTreeSelect-arrow arrow-down">&nbsp;</span>' +
                    '</div>' +
                    '</div>' +
                    '</li>' +
                    '</ul>' +
                    '<p><i>●</i>起止卡号或ICCID必须为连续号码</p>' +
                    '</div>' +
                    '</div>' +
                    '<div class="layui-layer-btn layui-layer-btn-r">' +
                    '<button class="btn-min layui-layer-btn0" type="button" onclick="top.closeBtn()">取消</button>' +
                    '<button class="btn-min layui-layer-btn1" lay-submit="" id="submitBtn"  lay-filter="submitBtn">确定</button>' +
                    '</div>' +
                    '</form>',
                success: function(layero, index){
                    top.form.render();//弹窗后初始化表单样式
                    //弹窗初始化菜单
                    var setting = {
                        view : {dblClickExpand : false, selectedMulti : false, showIcon : true, filter:true, fontCss : getFontCss},
                        check: {chkStyle : "checkbox", enable : false},
                        data : {simpleData : {enable : true}},
                        callback : {
                            onClick : top.zTreeOnClick,
                            onCheck : top.zTreeOnClick
                        }
                    };
                    $(function () {top.$("#qudaoSelectLayer").zTreeSelect(setting, zNodes);});//初始化渠道菜单

                    //上传文件弹窗
                    top.$('.fileinput').click(function () {
                        top.$(".fileSel").trigger("click");
                    });
                    top.$('.fileSel').change(function () {
                        var fileUrl=$(this).val();
                        top.$('.fileinput').val(fileUrl)
                    });

                    //验证表单
                    top.form.verify({
                        daoru: function(value){
                            if(value==''){
                                return '请上传导入文件';
                            }

                        },
                        qudao:function (value) {
                            if(value==''){
                                return '请选择渠道';
                            }
                        }

                    });
                    //提交表单
                    top.form.on('submit(submitBtn)', function (data) {
                        top.success('操作成功');//成功提示
                        //top.failure('导入失败','网络异常，请检查网络，稍后重试');//错误提示
                        return false;
                    });

                }
            })
        });

        //转沉默期
        $('#zhuanchenmoqi').click(function () {
            var checkStatus = table.checkStatus('TableData'), data = checkStatus.data;
            if(data == 0){
                layer.msg('请先选择数据，在进行操作！')
            }else {
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:'450px',
                    btnAlign: 'r',
                    skin:'layerTips',
                    shade:0.2,
                    title:false,
                    closeBtn:0,
                    content: "" +
                        "<div class='layerOpenCont'>" +
                        "<div class='Layer-txt'>" +
                        "<h3>您确定变更转沉默期吗？</h3>" +
                        "<p>说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明</p>" +
                        "</div>" +
                        "</div>",
                    btn:['取消','确定'],
                    btn2:function () {
                        top.success('操作成功');//成功提示
                        //top.failure('导入失败','网络异常，请检查网络，稍后重试');//错误提示
                        return false
                    }

                })
            }
        });

        //强制激活
        $('#qiangzhijihuo').click(function () {
            var checkStatus = table.checkStatus('TableData'), data = checkStatus.data;
            if(data == 0){
                layer.msg('请先选择数据，在进行操作！')
            }else {
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:'450px',
                    btnAlign: 'r',
                    skin:'layerTips',
                    shade:0.2,
                    title:false,
                    closeBtn:0,
                    content: "" +
                        "<div class='layerOpenCont'>" +
                        "<div class='Layer-txt'>" +
                        "<h3>您确定变更强制激活吗？</h3>" +
                        "<p>说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明</p>" +
                        "</div>" +
                        "</div>",
                    btn:['取消','确定'],
                    btn2:function () {
                        //top.success('操作成功');//成功提示
                        top.failure('变更强制激活失败','网络异常，请检查网络，稍后重试');//错误提示
                        return false
                    }

                })
            }
        });

        //停机
        $('#tingji').click(function () {
            var checkStatus = table.checkStatus('TableData'), data = checkStatus.data;
            if(data == 0){
                layer.msg('请先选择数据，在进行操作！')
            }else {
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:'450px',
                    btnAlign: 'r',
                    skin:'layerTips',
                    shade:0.2,
                    title:false,
                    closeBtn:0,
                    content: "" +
                        "<div class='layerOpenCont'>" +
                        "<div class='Layer-txt'>" +
                        "<h3>您确定变更停机吗？</h3>" +
                        "<p>说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明</p>" +
                        "</div>" +
                        "</div>",
                    btn:['取消','确定'],
                    btn2:function () {
                        top.success('操作成功');//成功提示
                        //top.failure('变更停机失败','网络异常，请检查网络，稍后重试');//错误提示
                        return false
                    }

                })
            }
        });
        //复机
        $('#fuji').click(function () {
            var checkStatus = table.checkStatus('TableData'), data = checkStatus.data;
            if(data == 0){
                layer.msg('请先选择数据，在进行操作！')
            }else {
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:'450px',
                    btnAlign: 'r',
                    skin:'layerTips',
                    shade:0.2,
                    title:false,
                    closeBtn:0,
                    content: "" +
                        "<div class='layerOpenCont'>" +
                        "<div class='Layer-txt'>" +
                        "<h3>您确定变更复机吗？</h3>" +
                        "<p>说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明</p>" +
                        "</div>" +
                        "</div>",
                    btn:['取消','确定'],
                    btn2:function () {
                        top.success('操作成功');//成功提示
                        return false
                    }

                })
            }
        });

        //数据关闭
        $('#guanbi').click(function () {
            var checkStatus = table.checkStatus('TableData'), data = checkStatus.data;
            if(data == 0){
                layer.msg('请先选择数据，在进行操作！')
            }else {
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:'450px',
                    btnAlign: 'r',
                    skin:'layerTips',
                    shade:0.2,
                    title:false,
                    closeBtn:0,
                    content: "" +
                        "<div class='layerOpenCont'>" +
                        "<div class='Layer-txt'>" +
                        "<h3>您确定关闭数据服务吗？</h3>" +
                        "<p>说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明</p>" +
                        "</div>" +
                        "</div>",
                    btn:['取消','确定'],
                    btn2:function () {
                        top.success('闭数据服务成功');//成功提示
                        return false
                    }

                })
            }
        });
        //数据恢复
        $('#huifu').click(function () {
            var checkStatus = table.checkStatus('TableData'), data = checkStatus.data;
            if(data == 0){
                layer.msg('请先选择数据，在进行操作！')
            }else {
                top.layer.open({
                    type:1,
                    fix: false, //不固定
                    maxmin: true,
                    move:false,
                    area:'450px',
                    btnAlign: 'r',
                    skin:'layerTips',
                    shade:0.2,
                    title:false,
                    closeBtn:0,
                    content: "" +
                        "<div class='layerOpenCont'>" +
                        "<div class='Layer-txt'>" +
                        "<h3>您确定恢复数据服务吗？</h3>" +
                        "<p>说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明说明</p>" +
                        "</div>" +
                        "</div>",
                    btn:['取消','确定'],
                    btn2:function () {
                        top.success('恢复数据服务成功');//成功提示
                        return false
                    }

                })
            }
        });

        //导出
        $('#daochu').click(function () {
            top.layer.open({
                type:1,
                fix: false, //不固定
                maxmin: true,
                move:false,
                area:'450px',
                btnAlign: 'r',
                skin:'layerTips',
                shade:0.2,
                title:false,
                closeBtn:0,
                content: "" +
                    "<div class='layerOpenCont'>" +
                    "<div class='Layer-txt'>" +
                    "<h3>您确定要导出数据吗？</h3>" +
                    "<p>因导出的数据量过大导致运行缓慢，请耐心等待</p>" +
                    "</div>" +
                    "</div>",
                btn:['取消','确定'],
                btn2:function () {
                    top.successBtn('导出成功','您导出的文件太大，已生成下载任务，请稍后在下载列表里下载导出文件')//成功提示
                    return false
                }

            })

        })
    })
</script>

</body>
</html>
